<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/index.css">
    <title>首页</title>
</head>
<body>
    <!-- 头部 -->
    <header>
        <!-- 头部占位容器 -->
        <div class="hd-placeholder"></div>
        <div class="top">
            <div class="log">
                <img src="./image/index/LOGO.png" alt="">
            </div>
            <div class="search">
                <form action="" id="search">
                    <input type="text" placeholder="请输入商品名称">
                </form>
                <button form="search">
                    <img src="./image/index/icon24.png" alt="">
                </button>
            </div>
            <div class="city">
                <select name="city" id="" size="1" itemid="city">
                    <option value="gz" selected>广州市</option>
                    <option value="sz">深圳市</option>
                    <option value="zs">中山市</option>
                    <option value="dg">东莞市</option>
                </select>
            </div>
        </div>
    </header>
    <!-- 大图片 -->
    <div class="banner"></div>
    <!-- 主体内容 -->
    <section>
        <!-- 更多 -->
        <div class="more">
            <div class="left">
                <img src="./image/index/团购.png" alt="">
                <a href="#"><h2>优惠团购</h2></a>
            </div>
            <div class="right">
                <a href="#">
                    <span>更多</span>
                    <img src="./image/index/更多.png" alt="">
                </a>
            </div>
        </div>
        <!-- 优惠图片 -->
        <div class="list">
            <div><a href="#"><img src="./image/index/图层-5.png" alt=""></a></div>
            <div><a href="#"><img src="./image/index/图层-6.png" alt=""></a></div>
            <div><a href="#"><img src="./image/index/图层-7.png" alt=""></a></div>
            <div><a href="#"><img src="./image/index/图层-8.png" alt=""></a></div>
        </div>
    </section>
    <!-- 商家列表 -->
    <div class="content">
        <!-- 更多 -->
        <div class="more">
            <div class="left">
                <img src="./image/index/形状-5.png" alt="">
                <a href="#"><h2>猜你喜欢</h2></a>
            </div>
            <div class="right">
                <a href="#">
                    <span>更多</span>
                    <img src="./image/index/更多.png" alt="">
                </a>
            </div>
        </div>
        <!-- 商家介绍 -->
        <ul class="shop">
            <li class="item item-1">
                <div>
                    <a href="./detail.html"></a>               
                </div>
                <ul>
                    <li>
                        <h2>
                            <a href="./detail.html">万岁寿司（正佳店）</a>
                        </h2>
                        <span>&lt;100m</span>
                    </li>
                    <li>[100店通用] 双人套餐</li>
                    <li>
                        <span>&yen; 88.00</span>
                        <span>已售1000</span>
                    </li>
                </ul>
            </li>
            <li class="item item-2">
                <div>
                    <a href="#"></a>               
                </div>
                <ul>
                    <li>
                        <h2>
                            <a href="#">周黑鸭（正佳店）</a>
                        </h2>
                        <span>&lt;100m</span>
                    </li>
                    <li>[100店通用] 双人套餐</li>
                    <li>
                        <span>&yen; 88.00</span>
                        <span>已售1000</span>
                    </li>
                </ul>
            </li>
            <li class="item item-1">
                <div>
                    <a href="./detail.html"></a>               
                </div>
                <ul>
                    <li>
                        <h2>
                            <a href="./detail.html">万岁寿司（正佳店）</a>
                        </h2>
                        <span>&lt;100m</span>
                    </li>
                    <li>[100店通用] 双人套餐</li>
                    <li>
                        <span>&yen; 88.00</span>
                        <span>已售1000</span>
                    </li>
                </ul>
            </li>
            <li class="item item-2">
                <div>
                    <a href="#"></a>               
                </div>
                <ul>
                    <li>
                        <h2>
                            <a href="#">周黑鸭（正佳店）</a>
                        </h2>
                        <span>&lt;100m</span>
                    </li>
                    <li>[100店通用] 双人套餐</li>
                    <li>
                        <span>&yen; 88.00</span>
                        <span>已售1000</span>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
    <!-- 页脚导航栏 -->
    <footer>
        <div class="ft-placeholder"></div>
        <div class="nav">
            <a href="./index.html">
                <img src="./image/index/首页.png" alt="">
                <span>首页</span>
            </a>
            <a href="./classify.html">
                <img src="./image/index/分类4.png" alt="">
                <span>分类</span>
            </a>
            <a href="./discover.html">
                <img src="./image/index/广场.png" alt="">
                <span>发现</span>
            </a>
            <a href="./my.html">
                <img src="./image/index/我的.png" alt="">
                <span>我的</span>
            </a>
        </div>
    </footer>
</body>
</html>